<template>
  <div>
    <el-table
      v-loading="loading"
      :data="listList"
      @selection-change="handleSelectionChange"
      @sort-change="dataListSortChangeHandle"
    >
      <!-- <el-table-column type="selection" width="55" align="center" /> -->
      <el-table-column
        sortable="custom"
        label="商品ID"
        align="center"
        prop="id"
      />
      <el-table-column label="盒子id" align="center" prop="goodsId" />
      <el-table-column label="赏分类" align="center" prop="shangId">
        <template slot-scope="scope">
          {{ class_shang[scope.row.shangId] }}
        </template>
      </el-table-column>
      <el-table-column label="产品名称" align="center" prop="title" />
      <el-table-column
        label="产品图片"
        align="center"
        prop="imgurl"
        width="120"
      >
        <template slot-scope="scope">
          <el-image
            fit="cover"
            :src="scope.row.imgUrl"
            style="width: 80px; height: 90px"
          />
        </template>
      </el-table-column>
      <el-table-column
        label="产品价值"
        sortable="custom"
        align="center"
        prop="price"
      />
      <el-table-column label="创建人" align="center" prop="userId" />

      <!-- <el-table-column
        fixed="right"
        label="操作"
        align="center"
        class-name="small-padding fixed-width"
      >
        <template slot-scope="scope">
          <el-button
            size="mini"
            type="text"
            icon="el-icon-edit"
            @click="handleUpdate(scope.row)"
            v-hasPermi="['system:list:edit']"
            >修改</el-button
          >

          <el-button
            size="mini"
            type="text"
            icon="el-icon-delete"
            @click="handleDelete(scope.row)"
            v-hasPermi="['system:list:remove']"
            >删除</el-button
          >
        </template>
      </el-table-column> -->
    </el-table>
  </div>
</template>

<script>
import { get_box_goods_list } from "@/api/czz/index.js";
import {

  getType,
} from "@/api/yfs/add_good.js";
export default {
  data() {
    return {
      listList: [],
      page: {
        page: 1,
        pageSize: 10,
      },
      class_shang: {},
      loading: false,
      total: 0,
      search: {
        status: 3,
      },

      queryParams: {
        goodsId: null,
      },
    };
  },

  methods: {
    //获取商品列表
    get_box_goods_list() {
      get_box_goods_list(this.queryParams.goodsId).then((res) => {
        this.loading = false;
        this.listList = res.data;
        console.log(this.listList);
      });
    },

    //获取赏类型
    getType() {
      getType().then((res) => {
        console.log(res.rows);

        res.rows.forEach((item) => {
          this.class_shang[item.id] = item.title;
        });
        this.get_box_goods_list();
        console.log(this.class_shang);
      });
    },
  },

  created() {
    this.queryParams.goodsId = this.$route.params.boxId || null;
    console.log(this.queryParams.goodsId);
    this.getType();
  },
};
</script>

<style></style>
